<!-- 设备处置 -->
<!-- eslint-disable vue/valid-v-for -->
<template>
  <a-modal
    class="disposeof"
    v-model:visible="showModal"
    :mask-closable="false"
    title="设备处置"
    @cancel="onClose"
    @before-ok="onConfirm"
    width="45vw"
    unmount-on-close
    :top="80"
    :align-center="false"
  >
    <page-form :model="form" layout="vertical" div="true" class="page-form" ref="formRef">
      <page-form-item field="vehicleNum" label="设备编号" size="1/2" style="margin-bottom: 0">
        <a-input placeholder="请输入" v-model="form.vehicleNum" disabled />
      </page-form-item>
      <page-form-item
        field="handleType"
        label="处置方式"
        required
        size="1/2"
        :rules="[{ required: true, message: '请完善必填项信息', trigger: 'change' }]"
        style="margin-bottom: 0"
      >
        <sysdict-select v-model="form.handleType" code="vehicle_handle_type" />
      </page-form-item>
      <page-form-item field="handlePerson" label="处置人" size="1/2" style="margin-bottom: 0">
        <a-select
          v-model="form.handlePerson"
          :loading="installerloading"
          placeholder="请选择"
          allow-search
          @search="getInstaller"
          @blur="getInstaller(($event = ''), (employeeId = ''))"
          :filter-option="false"
          popup-container=".disposeof"
        >
          <a-option v-for="item of installers" :value="item.id">{{ item.realname }}</a-option>
        </a-select>
      </page-form-item>
      <page-form-item field="handleTime" label="处置时间" size="1/2" style="margin-bottom: 0">
        <i-date-picker show-time value-format="YYYY-MM-DD HH:mm:ss" class="w-full" v-model="form.handleTime" />
      </page-form-item>
      <page-form-item field="handleRemark" label="处置备注" size="1" style="margin-bottom: 0">
        <a-textarea placeholder="请输入" :max-length="200" v-model="form.handleRemark" auto-size />
      </page-form-item>
    </page-form>
  </a-modal>
</template>

<script setup>
  import { ref, onMounted } from 'vue'
  import { vehicleDetail, vehicleHandle, findUserInfo, getStaff } from '@/api/asset/vehicle'
  import { Message } from '@arco-design/web-vue'
  import dayjs from 'dayjs'
  const showModal = ref(false)

  const show = (id) => {
    console.log(id)
    form.value.id = id
    getDetail(id)
    getUserInfo()
    getDates()
    showModal.value = true
  }

  // 获取车辆详情
  const form = ref({})
  const getDetail = (id) => {
    vehicleDetail({ id: id }).then((res) => {
      form.value.vehicleNum = res.result.vehicleNum
      form.value.handleType = 1
    })
  }

  // 获取当前用户
  const employeeId = ref(null)
  const orgIdList = ref([])
  const getUserInfo = () => {
    findUserInfo().then((res) => {
      orgIdList.value.push(res.result.epId)
      // form.value.handlePerson =  //默认当前登陆人
      employeeId.value = res.result.employeeId
      getInstaller()
    })
  }

  // 获取安装人
  const installers = ref([])
  const installerloading = ref(false)
  const getInstaller = (e) => {
    installerloading.value = true
    getStaff({ likeRealname: e, oldIdList: [Number(employeeId.value)] }).then((res) => {
      installers.value = res.result
      installerloading.value = false
      if (employeeId.value) {
        form.value.handlePerson = Number(employeeId.value) //默认当前登陆人
      }
    })
  }

  const getDates = () => {
    form.value.handleTime = dayjs(getNowDate(0)).format('YYYY-MM-DD HH:mm:ss')
  }

  // 默认日期时间
  const getNowDate = (n) => {
    console.log(n)
    var timestamp = Date.parse(new Date())
    timestamp = timestamp / 1000
    timestamp += Number(n) * 86400
    var newTime = new Date(timestamp * 1000)
    console.log(newTime)
    return newTime
  }

  const emit = defineEmits(['save'])
  const formRef = ref()
  const validateFn = () => {
    return new Promise((resolve, reject) => {
      formRef.value.validate((error) => {
        if (error) {
          console.log(error)
          reject()
        } else {
          resolve()
        }
      })
    })
  }
  const onConfirm = (done) => {
    return new Promise((resolve, reject) => {
      validateFn()
        .then(() => {
          vehicleHandle({ ...form.value })
            .then((res) => {
              console.log(res)
              Message.success(res.message)
              emit('save')
              form.value.handleRemark = ''
              showModal.value = false
              done()
              resolve()
            })
            .catch((err) => {
              console.log(err)
              // Message.error(err.message)
              reject()
            })
        })
        .catch(() => {
          reject()
        })
    })
  }

  defineExpose({
    show,
  })

  onMounted(() => {})
</script>

<style lang="less" scoped>
  // padding: 0 60px;
  :deep(.arco-row) {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  :deep(.arco-modal-body) {
    padding: 10px 80px !important;
  }
  :deep(.arco-col) {
    padding: 10px !important;
  }
</style>
